@import 'color.less';
//上传中
.uploadbg{
// display: none;
   position: fixed;
   left: 0;top:0;
   width:100%;
   height: 100%; 
   z-index: 400;
   background: rgba(0,0,0,0.6);
   p{
       text-align: center;
       color: #fff;
       margin-top: 45%;
   }
   .runline{
       position: absolute;
       width: 32px;height: 20px;
       left: 50%;top:50%;margin-left: -10px;margin-top: -10px;
       span{
           display: block;
           height:4px;
           width: 2px;
           border-radius: 2px;
           border:2px solid #fff;
           float: left;
           vertical-align: bottom;
           position: absolute;
           bottom: 0;
           transition:height 0.2s;
           -moz-transition: height 0.2s;  /* Firefox 4 */
           -webkit-transition:height 0.2s;   /* Safari 和 Chrome */
           -o-transition:height 0.2s;
       }
       span:first-child{
           left: -8px;
       }
       span:last-child{
           left: 16px;
       }
       span:nth-child(2){
           left: 0px;
       }
       span:nth-child(3){
           left:8px;
       }
   }
   p{
        width: 12em;
        height: 1.5em;
        line-height: 1.5em;
        position: absolute;
        left: -5em;
        top: -3em;
        color: #fff;
        font-style: normal;
        text-align: center;
   }
}
button{
    position: relative;
        overflow: initial;
    span{
        position: absolute;
        top:-10px;
        right: 10px; 
        display:block;
        width: 20px;
        height: 20px;
       background: url(../img/love.png) no-repeat center center;
       background-size:cover;
    }
}
.bannerbox{
    width: 100%;
    height: auto;
    overflow: hidden;
    vertical-align:top;
    img{
        float: left;
        position: relative;
        z-index: 10;
        height:auto;
        width: 100%;
        vertical-align: inherit;
        pointer-events: none;
    } 
}

//标题盒子
.titlebox{
    height: 46px;
    width: 100%;
    margin: 20px 0 0px;
    overflow: hidden;
    position: relative;
    img{
        width: 100%;
        pointer-events: none;
        position: absolute;left: -5%;
        top:2px;
    }
    .titlebg2{
        left: 95%;
    }
    span{
    display: block;
    position: absolute;
    height: 100%;
    left: 50%;
    top: 0px;
    width: 120px;
    background:#D6A8EA url(../img/textbg.png) no-repeat center top;
    background-size: 114px;
    margin-left: -60px;
    color: #fff;
    line-height:42px;
    text-align: center;
    }
}
//列表盒子
.listbox{
    width: 100%;
    height:auto;
    position: relative;
    overflow: hidden;
}
//报名信息
.applybox{
    position:position;
    top:0px;
    left: 0;
    width: 100%;
    height: auto;
    h3{
        background: #Fff;
        border-radius: 8px 8px 0 0;
        height: 30px;
        position: relative;
        margin: 0 4%;
        margin-top: 40px;
    }
    h3:before{
        content: "";
        display: block;
        width: 100%;
        height: 90px;
        position: absolute;
        top: -150%;
        left:0%;
        background: url(../img/sortInfoTitle.png) no-repeat center center;
        background-size: 50%;
    }
    .applyInfo{
        background: #fff;
        margin: 0px 4% 10px;
        border-radius:0 0 8px 8px;
        padding: 0px 6%;
        p{
            height: 55px;
            line-height: 55px;
            color: #0f0e17;
            font-size: 16px;
            input{
                background:#f1f1f1;
                width: 70%;
                float: right;
                font-size: 14px;
                border: none;
                outline: none;
                text-indent: 1em;
                height: 40px;
                border-radius: 4px;
                margin: 4px 0;
                
            }
            span{
                display: block;
                width: 70%;
                float: right;
                
                background:#f1f1f1;
                height:80px;
               margin: 4px 0;
               border-radius: 4px;
            }
            .postal{ //个人介绍p
                width: 90%;
                height: 80px;
                line-height: 40px;            
                font-size: 14px;
                background:#f1f1f1;
                border-radius: 4px;
                 outline: none;
                 border: none;
                 max-height: 80px;
                max-width: 90%;
                min-height: 80px;
                min-width: 90%;
                resize : none;
                padding-left: 1em;
            }
        }
        .submitbox{//提交p
            position: relative;
            a{
                display: block;
                position: absolute;
                width: 100%;
                height: 36px;
                line-height: 36px;
                background: url(../img/countdown.png) no-repeat left center;
                background-size: 100%;
                border: none;
                border-radius: 8px;
                margin-top: 2px;
                color: #fff;
                text-align: center;
            }
        }
        .postalTit{ //个人介绍textarea
            height: 80px;
            margin-bottom: 20px;
        }
        .apply-userTel{ //联系方式
            position: relative;
            margin-bottom: 10px;
            span{
                position: absolute;
                left: 30%;
                bottom: -15px;
                font-size: 12px;
                color: #ff4848;
                background: none;
                height: 20px;
                display: block;
                width: 70%;
                line-height: 20px;
            }
        }
        .uploadimg{ //上传图片
            display: flex;
            width: 100%;
            height: auto;
            margin: 20px 0 10px;
            position: relative;
            span{
                position: relative;
                display: block;
                height: 120px;
                background: #f1f1f1;
                flex: 1;
                vertical-align: top;
                text-align: center;
                line-height: 120px;
                background-size: cover;
                margin-bottom: 20px;
                padding: 6px;
                border-radius: 4px;
            }
            span:nth-of-type(2){
                margin: 0 20px;
            }
            img{
                max-width: 100%;
                max-height: 100%;
                text-align: center;
                vertical-align: middle;
                border-radius: 4px;
            }
            input{
                position: absolute;
                top:0;
                left: 0;
                display: block;
                height: 120px;
                width: 100%;
                margin: 0 auto;
                background: #FB9500;
                opacity: 0;
            }
        }
        .uploadimg:before{
            display: block;
            position: absolute;
            content: "最多可上传三张照片，照片可能会被裁减";
            left: 0;
            bottom: -5px;
            font-size: 12px;
            color: #777777;
        }
    }
}
//活动奖品
.activePrize{
    width: 100%;
    height: auto;
    margin-bottom: 10px;
    h3{
        background: #Fff;
        border-radius: 8px 8px 0 0;
        height: 30px;
        position: relative;
    }
    h3:before{
        content: "";
        display: block;
        width: 100%;
        height: 90px;
        position: absolute;
        top: -150%;
        left:0%;
        background: url(../img/first.png) no-repeat center center;
        background-size: 100%;
    }
    .secondPrize:before{
        background: url(../img/second.png) no-repeat center center;
        background-size: 100%;
    }
    .threePrize:before{
        background: url(../img/third.png) no-repeat center center;
        background-size: 100%;
    }
    .fourPrize:before{
        background: url(../img/four.png) no-repeat center center;
        background-size: 30%;
    }
    .prize{
        margin: 20px 4% 0;
        height: auto;
        border-radius:8px;
        display: flex;
        background: #fff;
        div{
           flex: 1;
           height: auto;
           p{
               text-align: center;
               line-height: 32px;
           }
           img{
               width: 70%;
               max-width: 100%;
               margin: 0 15%;
           }
           .fourimg{
                width: 90%;
                margin: 0px 4%;
                pointer-events: none;
           }
           .title2{
               height: 48px;
                line-height: 20px;
                padding-top: 16px;
           }
           .title1{
               height: 52px;
               line-height:52px;
           }
           p:first-child{
                margin: 20px 0;
                font-size: 14px;
                line-height: 20px;
           }
           p:last-child{
               color: #f00;
               margin: 0px 0 8px;
           }
        } 
        div:nth-of-type(2){
            margin: 0 8px;
        }
        
   }
}
